<template>
  <div id="content">
    <van-nav-bar title="申请详情" left-text="返回" left-arrow fixed @click-left="prev" />

    <van-steps :active="info.status" style="margin-top:60px">
      <van-step>正在审核</van-step>
      <van-step v-if="info.status == 1 && info.is_pass == -1" active-color="#f00">
        <span style="color:#f00">校长审核</span>
        <span style="color:#f00">({{info.pass_name}})</span>
      </van-step>
      <van-step v-else>
        校长审核
        <span v-if="info.status >= 1">({{info.pass_name}})</span>
      </van-step>
      <van-step v-if="info.status == 2 && info.is_edu_pass == -1">
        <span style="color:#f00">教育局审核</span>
        <span style="color:#f00">({{info.edu_pass_name}})</span>
      </van-step>
      <van-step v-else>
        教育局审核
        <span v-if="info.status >= 2">({{info.edu_pass_name}})</span>
      </van-step>
      <van-step>完成</van-step>
    </van-steps>

    <div class="content">
      <van-form validate-first @failed="onFailed" @submit="onSubmit">
        <van-field v-model="info.apply_name" label="类型" readonly />
        <!-- 接入申请 -->
        <div v-if="info.type == 1">
          <van-field v-model="info.apply_detail.school_name" label="学校名称" readonly />

          <van-field v-model="info.apply_detail.school_address" label="学校地址" readonly />

          <van-field v-model="info.apply_detail.apply_user" label="申请人" readonly />

          <van-field v-model="info.apply_detail.phone" label="联系电话" readonly />

          <van-field v-model="info.apply_detail.apply_date" label="申请日期" readonly />

          <van-field v-model="info.apply_detail.work_date" label="施工日期" readonly />

          <van-field v-model="info.apply_detail.floor" label="楼层位置" readonly />

          <van-field v-model="imgDesc" @click="imgPreView" label="学校盖章文件" readonly />

          <div v-if="info.apply_detail.insert_fee != 0">
            <van-field v-model="info.apply_detail.insert_fee_name" label="接入光纤初装费用承担方" readonly />

            <van-field v-model="info.apply_detail.month_fee_name" label="每月光纤信息费用承担方" readonly />
          </div>

          <van-field
            v-model="info.apply_detail.apply_content"
            label="申请内容"
            type="textarea"
            :autosize="{minHeight:100}"
            :minHeight="100"
            readonly
          />

          <div v-if="info.hasAddEduApprovel == true">
            <van-field
              name="insert_fee"
              label="接入光纤初装费用承担方"
              required
              :rules="[{required:true,message:'请选择接入光纤初装费用承担方'}]"
            >
              <template #input>
                <van-radio-group v-model="updateForm.insert_fee" direction="horizontal">
                  <van-radio name="1">学校</van-radio>
                  <van-radio name="2">教育局</van-radio>
                </van-radio-group>
              </template>
            </van-field>

            <van-field
              name="month_fee"
              label="每月光纤信息费用承担方"
              required
              :rules="[{required:true,message:'请选择每月光纤信息费用承担方'}]"
            >
              <template #input>
                <van-radio-group v-model="updateForm.month_fee" direction="horizontal">
                  <van-radio name="1">学校</van-radio>
                  <van-radio name="2">教育局</van-radio>
                </van-radio-group>
              </template>
            </van-field>
          </div>

          <div v-if="user.base.roles.dep_id == 1 && info.is_pass == 0 ">
            <van-field
              v-model="reject_reason"
              rows="3"
              :autosize="{minHeight:100}"
              :minHeight="100"
              label="审批意见"
              type="textarea"
              placeholder="请输入审批意见，驳回时必填"
            />
          </div>

          <van-field
            v-if="info.apply_detail.ip_address != null "
            v-model="info.apply_detail.ip_address"
            label="内网ip地址"
            readonly
          />

          <van-field
            v-if="info.hasIpApprovel == true "
            v-model="ip_address"
            label="内网ip地址"
            required
          />

          <div v-if="user.base.roles.dep_id == 2 && info.is_edu_pass == 0 ">
            <van-field
              v-model="reject_reason"
              rows="3"
              :autosize="{minHeight:100}"
              :minHeight="100"
              label="审批意见"
              type="textarea"
              placeholder="请输入审批意见，驳回时必填"
            />
          </div>

          <div v-if="info.reject_reasons != null">
            <van-cell>
              <div>审批日志</div>
              <div v-for="(item,index) in info.reject_reasons" :key="index">
                <div>{{index+1}}.驳回人：{{item.user}}</div>
                <div>时间：{{item.time}}</div>
                <div>原由：{{item.reason}}</div>
              </div>
            </van-cell>
          </div>

          <div style="margin: 16px;" v-if="info.hasIpApprovel == true">
            <van-button
              round
              :block="false"
              type="info"
              native-type="button"
              @click="saveIp"
              style="padding:0 40px"
            >保存</van-button>
          </div>

          <div style="margin: 16px;" v-if="info.hasAddApprovel">
            <div v-if="user.base.roles.dep_id == 1 && info.is_pass == 0">
              <van-button
                round
                :block="false"
                type="info"
                native-type="submit"
                style="padding:0 40px"
              >通过</van-button>
              <van-button
                round
                :block="false"
                type="danger"
                native-type="button"
                @click="rejects(1)"
                style="padding:0 40px"
              >驳回</van-button>
            </div>
            <div v-if="user.base.roles.dep_id == 2 && info.is_edu_pass == 0">
              <van-button
                round
                :block="false"
                type="info"
                native-type="submit"
                style="padding:0 40px"
              >通过</van-button>
              <van-button
                round
                :block="false"
                type="danger"
                native-type="button"
                @click="rejects(1)"
                style="padding:0 40px"
              >驳回</van-button>
            </div>
          </div>
        </div>
        <!-- 拆搬迁申请 -->
        <div v-if="info.type == 2">
          <van-field v-model="info.apply_detail.school_name" label="学校名称" readonly />

          <van-field v-model="info.apply_detail.school_address" label="学校地址" readonly />

          <van-field v-model="info.apply_detail.apply_user" label="申请人" readonly />

          <van-field v-model="info.apply_detail.phone" label="联系电话" readonly />

          <van-field v-model="info.apply_detail.apply_date" label="申请日期" readonly />

          <van-field v-model="info.apply_detail.move_date" label="光纤搬迁日期" readonly />

          <van-field v-model="info.apply_detail.renew_date" label="预期恢复日期" readonly />

          <van-field v-model="info.apply_detail.save_user" label="器件保管者" readonly />

          <van-field v-model="imgDesc" @click="imgPreView" label="学校盖章文件" readonly />

          <div v-if="info.status == 3">
            <van-field v-model="info.apply_detail.insert_fee_name" label="接入光纤初装费用承担方" readonly />

            <van-field v-model="info.apply_detail.month_fee_name" label="每月光纤信息费用承担方" readonly />
          </div>

          <van-field
            v-model="info.apply_detail.apply_content"
            label="申请内容"
            type="textarea"
            :autosize="{minHeight:100}"
            :minHeight="100"
            readonly
          />

          <div v-if="info.hasMoveEduApprovel == true">
            <van-field
              name="insert_fee"
              label="接入光纤初装费用承担方"
              required
              :rules="[{required:true,message:'请选择接入光纤初装费用承担方'}]"
            >
              <template #input>
                <van-radio-group v-model="updateForm.insert_fee" direction="horizontal">
                  <van-radio name="1">学校</van-radio>
                  <van-radio name="2">教育局</van-radio>
                </van-radio-group>
              </template>
            </van-field>

            <van-field
              name="month_fee"
              label="每月光纤信息费用承担方"
              required
              :rules="[{required:true,message:'请选择每月光纤信息费用承担方'}]"
            >
              <template #input>
                <van-radio-group v-model="updateForm.month_fee" direction="horizontal">
                  <van-radio name="1">学校</van-radio>
                  <van-radio name="2">教育局</van-radio>
                </van-radio-group>
              </template>
            </van-field>
          </div>

          <div v-if="user.base.roles.dep_id ==1  && info.is_pass == 0 ">
            <van-field
              v-model="reject_reason"
              rows="3"
              :autosize="{minHeight:100}"
              :minHeight="100"
              label="审批意见"
              type="textarea"
              placeholder="请输入审批意见，驳回时必填"
            />
          </div>

          <div v-if="user.base.roles.dep_id == 2 && info.is_edu_pass == 0 ">
            <van-field
              v-model="reject_reason"
              rows="3"
              :autosize="{minHeight:100}"
              :minHeight="100"
              label="审批意见"
              type="textarea"
              placeholder="请输入审批意见，驳回时必填"
            />
          </div>

          <div v-if="info.reject_reasons != null">
            <van-cell>
              <div>审批日志</div>
              <div v-for="(item,index) in info.reject_reasons" :key="index">
                <div>{{index+1}}.驳回人：{{item.user}}</div>
                <div>时间：{{item.time}}</div>
                <div>原由：{{item.reason}}</div>
              </div>
            </van-cell>
          </div>

          <div style="margin: 16px;" v-if="info.hasMoveApprovel">
            <div v-if="user.base.roles.dep_id == 1 && info.is_pass == 0">
              <van-button
                round
                :block="false"
                type="info"
                native-type="submit"
                style="padding:0 40px"
              >通过</van-button>
              <van-button
                round
                :block="false"
                type="danger"
                native-type="button"
                @click="rejects(1)"
                style="padding:0 40px"
              >驳回</van-button>
            </div>
            <div v-if="user.base.roles.dep_id == 2 && info.is_edu_pass == 0">
              <van-button
                round
                :block="false"
                type="info"
                native-type="submit"
                style="padding:0 40px"
              >通过</van-button>
              <van-button
                round
                :block="false"
                type="danger"
                native-type="button"
                @click="rejects(1)"
                style="padding:0 40px"
              >驳回</van-button>
            </div>
          </div>
        </div>
        <!-- 虚拟化服务器申请 -->
        <div v-if="info.type == 3">
          <van-field v-model="info.apply_detail.number" label="编号" readonly />

          <van-field v-model="info.apply_detail.write_date" label="填表日期" readonly />

          <van-field v-model="info.apply_detail.school_name" label="学校名称" readonly />

          <van-field v-model="info.apply_detail.identity_name" label="单位名称" readonly />

          <van-field v-model="info.apply_detail.fzr_name" label="负责人姓名" readonly />

          <van-field v-model="info.apply_detail.fzr_mobile" label="负责人手机" readonly />

          <van-field v-model="info.apply_detail.fzr_phone" label="负责人办公电话" readonly />

          <van-field v-model="info.apply_detail.fzr_email" label="负责人邮箱" readonly />

          <van-field v-model="info.apply_detail.adm_name" label="管理人姓名" readonly />

          <van-field v-model="info.apply_detail.adm_mobile" label="管理人手机" readonly />

          <van-field v-model="info.apply_detail.adm_phone" label="管理人办公电话" readonly />

          <van-field v-model="info.apply_detail.adm_email" label="管理人邮箱" readonly />

          <van-field v-model="info.apply_detail.open_port" label="开发端口" readonly />

          <van-field v-model="info.apply_detail.servers_name" label="服务范围" readonly />

          <van-field v-model="info.apply_detail.is_domain" label="是否需要域名" readonly />

          <van-field v-model="info.apply_detail.domain_name" label="域名" readonly />

          <van-field v-model="imgDesc" @click="imgPreView" label="学校盖章文件" readonly />

          <van-field
            v-model="info.apply_detail.apply_content"
            label="主要用途"
            type="textarea"
            :autosize="{minHeight:100}"
            :minHeight="100"
            readonly
          />

          <van-field
            v-model="info.apply_detail.apply_resaon"
            label="申请理由"
            type="textarea"
            :autosize="{minHeight:100}"
            :minHeight="100"
            readonly
          />

          <div v-if="info.hasLeaderApprovel == true">
            <van-field
              v-model="updateForm.info_opinion"
              label="（填写）信息中心领导意见"
              type="textarea"
              :autosize="{minHeight:100}"
              :minHeight="100"
            />

            <van-field
              v-model="updateForm.info_result"
              label="（填写）信息中心处理结果"
              type="textarea"
              :autosize="{minHeight:100}"
              :minHeight="100"
            />
          </div>

          <div>
            <van-field
              v-if="info.apply_detail.info_opinion != null"
              v-model="info.apply_detail.info_opinion"
              label="信息中心领导意见"
              type="textarea"
              :autosize="{minHeight:100}"
              :minHeight="100"
              readonly
            />

            <van-field
              v-if="info.apply_detail.info_result != null"
              v-model="info.apply_detail.info_result"
              label="信息中心处理结果"
              type="textarea"
              :autosize="{minHeight:100}"
              :minHeight="100"
              readonly
            />
          </div>

          <div v-if="user.base.roles.dep_id == 1 && info.is_pass == 0 ">
            <van-field
              v-model="reject_reason"
              rows="3"
              :autosize="{minHeight:100}"
              :minHeight="100"
              label="审批意见"
              type="textarea"
              placeholder="请输入审批意见，驳回时必填"
            />
          </div>

          <div v-if="user.base.roles.dep_id == 3 && info.is_edu_pass == 0 ">
            <van-field
              v-model="reject_reason"
              rows="3"
              :autosize="{minHeight:100}"
              :minHeight="100"
              label="审批意见"
              type="textarea"
              placeholder="请输入审批意见，驳回时必填"
            />
          </div>

          <div v-if="info.reject_reasons != null">
            <van-cell>
              <div>审批日志</div>
              <div v-for="(item,index) in info.reject_reasons" :key="index">
                <div>{{index+1}}.驳回人：{{item.user}}</div>
                <div>时间：{{item.time}}</div>
                <div>原由：{{item.reason}}</div>
              </div>
            </van-cell>
          </div>

          <div
            style="margin: 16px;"
            v-if="info.hasServerApprovel == false && info.hasLeaderApprovel == true"
          >
            <van-button
              round
              :block="false"
              type="info"
              native-type="button"
              style="padding:0 40px"
              @click="supply"
            >补充</van-button>
          </div>

          <div style="margin: 16px;" v-if="info.hasServerApprovel == true">
            <div v-if="user.base.roles.dep_id == 1 && info.is_pass == 0">
              <van-button
                round
                :block="false"
                type="info"
                native-type="submit"
                style="padding:0 40px"
              >通过</van-button>
              <van-button
                round
                :block="false"
                type="danger"
                native-type="button"
                @click="rejects(1)"
                style="padding:0 40px"
              >驳回</van-button>
            </div>
            <div v-if="user.base.roles.dep_id == 3 && info.is_edu_pass == 0">
              <van-button
                round
                :block="false"
                type="info"
                native-type="submit"
                style="padding:0 40px"
              >通过</van-button>
              <van-button
                round
                :block="false"
                type="danger"
                native-type="button"
                @click="rejects(1)"
                style="padding:0 40px"
              >驳回</van-button>
            </div>
          </div>
        </div>
      </van-form>
    </div>
  </div>
</template>

<script>
import Vue from 'vue'
import { Form, Button, Field, Calendar, Cell, Step, Steps, ImagePreview, RadioGroup, Radio, Toast, NavBar, Dialog } from 'vant'
import { applyDetail, approval, saveIpAddress, supplyInfo } from '../../api/userApply'
import { getUserInfo } from '../../api/user'

Vue.use(Form).use(Button).use(Field).use(Calendar).use(Cell).use(Step).use(Steps).use(ImagePreview).use(RadioGroup).use(Radio).use(NavBar).use(Dialog)

export default {
  data()
  {
    return {
      id: 0,
      imgDesc: '点击查看学校盖章文件',
      info: {
        status: 0,
        type: 1,
        hasAddApprovel: false,
        showFeeSelect: false,
        hasMoveApprovel: false,
        hasServerApprovel: false,
        apply_detail: {},
        reject_reasons: []
      },
      user: {
        base: {
          roles: {}
        }
      },
      updateForm: {
        insert_fee: 0,
        month_fee: 0,
        info_opinion: '',
        info_result: ''
      },
      reject_reason: '',
      ip_address: ''
    }
  },
  created()
  {
    this.id = this.$route.params.id
    this.fetchDetail()
    this.fetchUserInfo()
  },
  methods: {
    fetchDetail()
    {
      applyDetail({ id: this.id }).then(res =>
      {
        this.info = res.data
        this.updateForm.insert_fee = res.data.apply_detail.insert_fee.toString()
        this.updateForm.month_fee = res.data.apply_detail.month_fee.toString()
      })
    },
    fetchUserInfo()
    {
      getUserInfo().then(res =>
      {
        this.user = res.data
      })
    },
    imgPreView()
    {
      ImagePreview(this.info.apply_detail.school_online_file)
    },
    prev()
    {
      this.$router.go(-1)
    },
    editThing(id, type)
    {
      if (type == 1)
      {
        this.$router.push({ name: 'editInsert', params: { id: id } })
      } else if (type == 2)
      {
        this.$router.push({ name: 'editMove', params: { id: id } })
      } else
      {
        this.$router.push({ name: 'editServer', params: { id: id } })
      }
    },
    onFailed(errorInfo)
    {
      console.log('failed', errorInfo)
    },
    onSubmit(params)
    {
      if (this.user.base.role == 0)
      {
        Toast('无权审批！')
      } else
      {
        this.updateForm.apply_id = this.info.id
        this.updateForm.detail_id = this.info.detail_id
        this.updateForm.is_edu_pass = 1
        this.updateForm.is_pass = 1
        this.updateForm.type = this.info.type

        approval(this.updateForm).then(res =>
        {
          var self = this
          Dialog.alert({
            message: res.message,
            theme: 'round-button'
          }).then(() =>
          {
            self.$router.go(-1)
          })
        }).catch(err =>
        {
          Dialog.alert({
            message: err.data.message,
            theme: 'round-button'
          }).then(() =>
          {

          })
        })
      }
    },
    // 驳回
    rejects(type)
    {
      if (this.reject_reason.length <= 0)
      {
        Toast('请填写审批意见！')
        return
      }
      approval({ apply_id: this.info.id, detail_id: this.info.detail_id, type: type, is_pass: -1, is_edu_pass: -1, reject_reason: this.reject_reason }).then(res =>
      {
        /*  Toast(res.message)
        var self = this
        setTimeout(() =>
        {
          self.$router.push({ path: '/applyList' })
        }, 1500) */
        Dialog.alert({
          message: res.message,
          theme: 'round-button'
        }).then(() =>
        {
          this.$router.go(-1)
        })
      }).catch(err =>
      {
        Dialog.alert({
          message: err.data.message,
          theme: 'round-button'
        }).then(() =>
        {

        })
      })
    },
    // 保存ip
    saveIp()
    {
      saveIpAddress({ detail_id: this.info.detail_id, ip_address: this.ip_address }).then(res =>
      {
        Dialog.alert({
          message: res.message,
          theme: 'round-button'
        }).then(() =>
        {
          this.$router.go(-1)
        })
      }).catch(err =>
      {
        Dialog.alert({
          message: err.data.message,
          theme: 'round-button'
        }).then(() =>
        {

        })
      })
    },
    // 补充意见
    supply()
    {
      supplyInfo({ detail_id: this.info.detail_id, info_opinion: this.updateForm.info_opinion, info_result: this.updateForm.info_result }).then(res =>
      {
        Dialog.alert({
          message: res.message,
          theme: 'round-button'
        }).then(() =>
        {
          this.$router.go(-1)
        })
      }).catch(err =>
      {
        Dialog.alert({
          message: err.data.message,
          theme: 'round-button'
        }).then(() =>
        {

        })
      })
    }
  }
}
</script>

<style scoped>
.van-step--horizontal {
  text-align: left;
}
</style>
